<div class="container">
  <p>Coco</p>
</div>
<div class="g-test"></div>


<style>
  html,
  body {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 10px;
  }

  .container {
    width: 150px;
    padding: 10px;
    contain: layout;
    border: 1px solid red;
  }

  .g-test {
    width: 150px;
    height: 150px;

    border: 1px solid green;
  }

  p {
    position: relative;
    border: 1px solid #333;
    margin: 5px;
    font-size: 14px;
  }
</style>

<script>
  let container = document.querySelector('.container')
  container.addEventListener('click', () => {
    const child = document.createElement('p')
    child.innerHTML = "AAA"
    container.appendChild(child)
  })
</script>